<style scoped>
.buy-menu{background: #fff;justify-content: space-between;padding: 10px;}
.buy-menu>.left>*{margin-right: 8px;}
.buy-menu>.right>*{margin-left: 8px;}
.buy-menu .van-icon{font-size: 24px;}
</style>
<template>
  <div class="buy-menu flex" @click.stop="">
    <div class="left flex">
      <van-icon v-if="show_add_cart" name="cart-o" :badge="cart_count>0?cart_count:''" text="购物车" color="#ee0a24" @click="to_cart"></van-icon>
    </div>
    <div class="right">
      <van-button v-if="show_add_cart" type="default" @click="add_cart">加入购物车</van-button>
      <van-button type="primary" @click="buy">立即购买</van-button>
    </div>
  </div>
</template>

<script>

import tool from "@/js/tool.js";
import {ajax} from "@/js/api_tool.js";
import {S94Model} from "@/js/S94Model.ts";
import {href_handle} from "@/vue_plugin/router_auto.js";
import Money from "@/components/widget/Money.vue";

/**
 * @prop {*}
 */
export default {
  components: {Money},
  _title_: '购买菜单',
  _tip_: '具备购买项目的菜单组件',
  _head_img_: '',
  _group_: '详情组件',
  props:{
    model_name: {
      type: String,
      _label_: '项目模型',
      _tip_: '购买的项目模型',
      _required_: true,
      _default_: "get($input,'model_name')",
    },
    id: {
      type: [String, Number],
      _label_: '项目ID',
      _tip_: '购买的项目ID',
      _required_: true,
      _default_: "get($input,'id')",
    },
    show_add_cart: {
      type: Boolean,
      _label_: '显示购物车',
      _tip_: '',
    },
    model_name_order: {
      type: String,
      _label_: '订单模型',
      _tip_: '购买对应的订单模型，如果为空，会根据项目模型推算(开启支付系统的子模型)',
    },
    model_name_order_action: {
      type: String,
      _label_: '购买操作名',
      _tip_: '购买对应的订单模型的操作，如果为空，会自动推算(用户可执行的订单模型的添加操作)',
    },
    title: {
      type: [String, Number],
      _label_: '结算标题',
      _tip_: '点击购买调整到结算页面显示的标题',
      _default_: "get($info,'title')",
    },
    head_img: {
      type: [String, Number],
      _label_: '结算头图',
      _tip_: '点击购买调整到结算页面显示的头图',
      _default_: "get($info,'head_img')",
    },
    price: {
      type: [String, Number],
      _label_: '结算价格',
      _tip_: '点击购买调整到结算页面显示的价格',
      _default_: "get($info,'price')",
    },

  },
  data(){
    let model = S94Model.find(this.model_name);
    return {
      model: model,

      sku_additional_cache: null,

      cart_count: 0,
      cart_row: {
        sku_id: 0,
        additional_select: {},
        num: 1,
      },
    }
  },
  methods:{
    href_handle,
    to_cart(){
      let cart = this.model.cart(this.model_name_order, this.action);
      if (cart) cart.to_index();
    },

    async sku_additional(){
      if (this.sku_additional_cache) return this.sku_additional_cache;
      return new Promise((resolve, reject) => {
        ajax(`/home/index/sku_additional?model_name=${this.model_name}&id=${this.id}`, res=>{
          this.sku_additional_cache = res.data;
          resolve(res.data);
        }, reject)
      })
    },

    async sku_select(){
      let {sku_group, sku_list} = await this.sku_additional();
      if (!sku_list.length) return {sku_id: 0}
      return tool.select_sku(sku_group, sku_list, this.model.switch_stock, this.cart_row.sku_id, this.cart_row.num).then((sku)=>{
        return {
          sku_id: sku.id,
          num: sku.num,
          price: sku.price,
          title: sku.title,
          head_img: sku.head_img,
        }
      });
    },
    async select_additional(){
      let {additional_list, additional_group} = await this.sku_additional();
      if (!additional_list.length) return {additional_select:{}};
      return tool.select_additional(additional_list, additional_group, this.cart_row.additional_select).then((additional_select)=>{
        return {additional_select};
      })
    },

    async buy(){
      if (!this.model) throw new Error('模型不存在');
      let cart = this.model.cart(this.model_name_order, this.action);
      if (!cart) throw new Error('购买操作不存在');

      Object.assign(this.cart_row, await this.sku_select());
      Object.assign(this.cart_row, await this.select_additional());

      let cart_row = this.cart_row;
      cart_row.link_id = this.id;
      if (!cart_row.title) cart_row.title = this.title;
      if (!cart_row.head_img) cart_row.head_img = this.head_img;
      if (!cart_row.price) cart_row.price = this.price;

      cart.add_item(cart_row).to_buy();
    },
    async add_cart(){
      if (!this.model) throw new Error('模型不存在');
      let cart = this.model.cart(this.model_name_order, this.action);
      if (!cart) throw new Error('购买操作不存在');

      let data = Object.assign({}, cart);
      data.link_id = this.id;
      data.sku_id = (await this.sku_select()).sku_id;
      data.additional_select = (await this.select_additional()).additional_select;

      let res = await ajax({url:'/home/cart/add', data:data})
      this.cart_count = res.data.sum_num;
    },


  },
  computed:{
  },
  mounted(){
  }
}
</script>